// // 封装自定义指令 -- 自动聚焦
// // 封装成一个插件 - 使用vue.usezhuce1
// // vue.use中需要一个install方法

// // 自定义指令中有一个inserted方法，用于接收指令绑定的dom和bind
// export default {
//   install (Vue) {
//     Vue.directive('focus', {
//       // 当被绑定的元素插入到 DOM 中时
//       inserted: function (el) {
//         // el = el.querySelector('input')
//         // // 聚焦元素
//         // el.focus()
//         if (el.nadeName === 'INPUT' || el.nodeName === 'TEXTAREA') {
//           el.focus()
//         } else {
//           const inp = el.querySelector('input')
//           const textArea = el.querySelector('textarea')
//           if (inp || textArea) {
//             inp && inp.focus()
//             textArea && textArea.focus()
//           } else {
//             console.error('请把v-focus用在输入框标签上')
//           }
//         }
//       }
//     })
//   }
// }

import Vue from 'vue'
// 插件对象(必须有install方法, 才可以注入到Vue.use中)
export default {
  install () {
    Vue.directive('focus', {
      inserted (el) {
        fn(el)
      },
      update (el) {
        fn(el)
      }
    })
  }
}
function fn (el) {
  if (el.nodeName === 'INPUT' || el.nodeName === 'TEXTAREA') {
    // 如果直接是input标签/textarea标签
    el.focus()
  } else {
    // 指令在van-search组件身上, 获取的是组件根标签div, 而input在标签内
    const inp = el.querySelector('input')
    const textArea = el.querySelector('textarea')
    // 如果找到了
    if (inp || textArea) {
      inp && inp.focus()
      textArea && textArea.focus()
    } else {
      // 本身也不是, 子标签里也没有
      console.error('请把v-fofo用在输入框标签上')
    }
  }
}
